﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"
    CodeBehind="each.aspx.cs" Inherits="jQuery.each" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <script src="Scripts/jquery-1.6.4.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        //$(document).ready(),当页面DOM元素加载完时执行,也可以不用,把jq代码放到body后面
        $(document).ready(function () {

            //jQ遍历
            $("#button1").click(function () {
                var arr1 = { 小海: "11", 中海: "22", 大海: "33" };
                $.each(arr1, function (key, value) {
                    alert("arr1:" + key + "今年" + value + "岁啦!");
                });
            });

            //另一种写法
            $("#button2").click(function () {
                var arr2 = { "小海": 11, "中海": 22, "大海": 33 };
                $.each(arr2, function (key, value) {
                    alert("arr2:" + key + "今年" + value + "岁啦!");
                });
            });

            //this在这中指value,而不是key,一般用上面第一个写法
            $("#button3").click(function () {
                var arr3 = { 小海: "11", 中海: "22", 大海: "33" };
                $.each(arr3, function () {
                    alert("arr3:今年" + this + "岁啦!");
                });
            });

        });
    </script>
    ************************HTML代码*****************************
    <div>
        <div>
            代码1<br />
            //jQ遍历
            <br />
            var arr1 = { 小海: "11", 中海: "22", 大海: "33" }; $.each(arr1, function (key, value)
            { alert("arr1:" + key + "今年" + value + "岁啦!"); });
            <div>
                <input type="button" id="button1" value="Run" /></div>
        </div>
        <div>
            代码2<br />
            //jQ遍历//另一种写法
            <br />
            var arr2 = { "小海": 11, "中海": 22, "大海": 33 }; $.each(arr2, function (key, value)
            { alert("arr2:" + key + "今年" + value + "岁啦!"); });
            <div>
                <input type="button" id="button2" value="Run" /></div>
        </div>
        <div>
            代码3<br />
            //jQ遍历 //this在这中指value,而不是key,一般用上面第一个写法
            <br />
            var arr3 = { 小海: "11", 中海: "22", 大海: "33" }; $.each(arr3, function () { alert("arr3:今年"
            + this + "岁啦!"); });
            <div>
                <input type="button" id="button3" value="Run" /></div>
        </div>
    </div>
</asp:Content>
